<%--
  Created by IntelliJ IDEA.
  User: 王韫琛
  Date: 2021/1/18
  Time: 14:12
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户信息添加</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/webjars/layui/2.5.6/css/layui.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/webjars/layui/2.5.6/layui.all.js">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/webjars/layui/2.5.6/layui.js">
</head>
<body>
<div style="text-align: center;">
    <br>
    <fieldset class="layui-elem-field layui-field-title">
        <legend>住户信息添加</legend>
    </fieldset>
    <br>
    <div class="layui-inline">
        <form action="" class="layui-form" method="post">
            <div class="layui-form-item">
                <label class="layui-form-label" for="house_username" style="width: 120px">户主姓名:</label>
                <div class="layui-input-inline">
                    <input type="text" name="house_username" id="house_username" class="layui-input" required
                           lay-verify="required"
                           lay-reqText="请输入户主姓名" placeholder="请输入户主姓名" autocomplete="off">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="house_number" style="width: 120px">门牌号:</label>
                <div class="layui-input-inline">
                    <input type="text" name="house_number" id="house_number" class="layui-input" required
                           lay-verify="required"
                           lay-reqText="请输入门牌号" placeholder="请输入门牌号" autocomplete="off">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="gender" style="width: 120px">性别:</label>
                <div class="layui-input-inline">
                    <input type="radio" name="gender" id="gender" value="男" title="男" checked="checked">
                    <input type="radio" name="gender" value="女" title="女">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="certificate_number" style="width: 120px">身份证号:</label>
                <div class="layui-input-inline">
                    <input type="text" name="certificate_number" id="certificate_number" class="layui-input" required
                           lay-verify="required|identity"
                           lay-reqText="身份证号" placeholder="身份证号" autocomplete="off">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="nation" style="width: 120px">民族:</label>
                <div class="layui-input-inline">
                    <input type="text" name="nation" id="nation" class="layui-input" required
                           lay-verify="required"
                           lay-reqText="请输入民族"
                           placeholder="请输入民族" autocomplete="off">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="test1" style="width: 120px">生日:</label>
                <div class="layui-input-inline">
                    <input type="text" name="birthday" required lay-verify="required|data" class="layui-input"
                           placeholder="请输入生日" id="test1">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="education" style="width: 120px">学历:</label>
                <div class="layui-input-inline">
                    <input type="text" name="education" id="education" class="layui-input" required
                           lay-verify="required"
                           lay-reqText="请输入学历" placeholder="请输入学历" autocomplete="off">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="permanent_address" style="width: 120px">户籍地址:</label>
                <div class="layui-input-inline">
                    <input type="text" name="permanent_address" id="permanent_address" class="layui-input" required
                           lay-verify="required"
                           lay-reqText="请输入籍贯" placeholder="请输入籍贯" autocomplete="off">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="hobby" style="width: 120px">爱好:</label>
                <div class="layui-input-inline">
                    <input type="text" name="hobby" id="hobby" class="layui-input" required lay-verify="required"
                           lay-reqText="请输入爱好" placeholder="请输入爱好" autocomplete="off">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="home_phone" style="width: 120px">住宅电话</label>
                <div class="layui-input-inline">
                    <input type="text" name="home_phone" id="home_phone" class="layui-input" required
                           lay-verify="required|phone"
                           lay-reqText="请输入住宅电话" placeholder="请输入住宅电话" autocomplete="off">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="cell_phone_number" style="width: 120px">手机号:</label>
                <div class="layui-input-inline">
                    <input type="text" name="cell_phone_number" id="cell_phone_number" class="layui-input" required
                           lay-verify="required|phone"
                           lay-reqText="请输入手机号" placeholder="请输入手机号" autocomplete="off">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="work_unit" style="width: 120px">工作单位:</label>
                <div class="layui-input-inline">
                    <input type="text" name="work_unit" id="work_unit" class="layui-input" required
                           lay-verify="required"
                           lay-reqText="请输入工作单位" placeholder="请输入工作单位" autocomplete="off">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="work_telephone" style="width: 120px">单位电话:</label>
                <div class="layui-input-inline">
                    <input type="text" name="work_telephone" id="work_telephone" class="layui-input" required
                           lay-verify="required"
                           lay-reqText="请输入单位电话" placeholder="请输入单位电话" autocomplete="off">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label" for="unit_address" style="width: 120px">单位地址:</label>
                <div class="layui-input-inline">
                    <input type="text" name="unit_address" id="unit_address" class="layui-input" required
                           lay-verify="required"
                           lay-reqText="请输入单位地址" placeholder="请输入单位地址" autocomplete="off">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="emergency_contact" style="width: 120px">紧急联系人:</label>
                <div class="layui-input-inline">
                    <input type="text" name="emergency_contact" id="emergency_contact" class="layui-input" required
                           lay-verify="required"
                           lay-reqText="请输入紧急联系人" placeholder="请输入紧急联系人" autocomplete="off">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" for="emergency_contact_number" style="width: 120px">紧急联系人电话:</label>
                <div class="layui-input-inline">
                    <input type="text" name="emergency_contact_number" id="emergency_contact_number" class="layui-input"
                           required
                           lay-verify="required|phone"
                           lay-reqText="请输入紧急联系人电话" placeholder="请输入紧急联系人电话" autocomplete="off">
                </div>
            </div>
            <div class="layui-input-inline" style="padding-left: 45px">
                <button class="layui-btn" lay-submit lay-filter="doSubmit" lay-event="add">注册</button>
                &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                <button type="reset" class="layui-btn layui-btn-warm">重置</button>
            </div>
        </form>
    </div>
</div>
<script src="${pageContext.request.contextPath}/webjars/layui/2.5.6/layui.js"></script>
<script>
    layui.use(['laydate', 'layer', 'form', 'jquery'], function () {
        var laydate = layui.laydate;
        var form = layui.form;
        var $ = layui.jquery;
        var url = "/adminToAddUserInformation";
        //执行一个laydate实例
        laydate.render({
            elem: '#test1' //指定元素
            , format: 'yyyy-MM-dd'
        });
        //标识是否存在
        var flag = false;
        //检测身份证开始
        $("#certificate_number").blur(function () {
            //获取输入的身份证号
            let certificate_number = $(this).val().trim();
            console.log(certificate_number);
            //判断是否为空
            if (certificate_number.length > 0) {
                $.get("/findByCertificateNumber", {"certificate_number": certificate_number}, function (result) {
                    if (result.success) {
                        layer.tips(result.message, "#certificate_number");
                        flag = true;
                    } else {
                        flag = false;
                        layer.tips(result.message, "#certificate_number");
                    }
                }, "json");
            }
        });
        //检测身份证结束

        //检测手机号开始
        $("#cell_phone_number").blur(function () {
            //获取输入的用户名
            let cell_phone_number = $(this).val().trim();
            //判断是否为空
            if (cell_phone_number.length > 0) {
                $.get("/findByCellPhoneNumber", {"cell_phone_number": cell_phone_number}, function (result) {
                    if (result.success) {
                        //layer.msg(result.message);
                        layer.tips(result.message, "#cell_phone_number");
                        flag = true;
                    } else {
                        flag = false;
                        layer.tips(result.message, "#cell_phone_number");
                    }
                }, "json");
            }
        });
        //检测手机号结束
        //表单监听事件
        form.on("submit(doSubmit)", function (data) {
            console.log(data)
            if (flag) {
                layer.msg("信息有误");
            } else {
                $.post(url, data.field, function (result) {
                    if (result.success) {
                        layer.alert(result.message, {icon: 1}, function (index) {
                            location.href = "/household_information_maintenance";
                            layer.close(index);
                        });
                    } else {
                        layer.alert(result.message, {icon: 2});
                    }
                }, "json");
            }
            //禁止页面跳转
            return false;
        });
    });
</script>
</body>
</html>
